<script setup lang="ts">
import mcht from '@/api/mcht'
import { useAuthStore, useAppStore } from '@/store'

const authStore = useAuthStore()
const { sessionid } = storeToRefs(authStore)
const { windowWidth } = storeToRefs(useAppStore())
onLoad((options: any) => {
  if (options.sysSeqNum) {
    form.sysSeqNum = options.sysSeqNum
  } else {
    uni.showModal({
      title: '参数读取错误',
      content: '页面链接缺少必要请求参数',
      showCancel: false
    })
  }
})
const form = reactive({
  sysSeqNum: '',
  mchtName: '',
  mchtNo: '',
  statusDesc: '',
  transAmt: '',
  transTime: '',
  txnDesc: '',
  origSysSeqNum: ''
})
onMounted(async () => {
  // 判断登录状态
  if (sessionid.value) {
    const { data } = await mcht.getOrderInfo(form.sysSeqNum)
    if (data.status === 'success') {
      form.mchtName = data.data.mchtName
      form.mchtNo = data.data.mchtNo
      form.statusDesc = data.data.statusDesc
      form.transAmt = data.data.transAmt
      form.transTime = data.data.transTime
      form.txnDesc = data.data.txnDesc
      form.origSysSeqNum = data.data.origSysSeqNum
    }
  } else {
    authStore.navigateToLogin()
  }
})
</script>

<template>
  <nut-cell-group>
    <nut-cell title="商户名称" v-if="form.mchtName" :desc="form.mchtName"></nut-cell>
    <nut-cell title="支付方式" v-if="form.txnDesc" :desc="form.txnDesc"></nut-cell>
    <nut-cell title="付款金额" v-if="form.transAmt" :desc="form.transAmt"></nut-cell>
    <nut-cell title="交易单号" v-if="form.sysSeqNum" :desc="form.sysSeqNum"></nut-cell>
    <nut-cell title="交易时间" v-if="form.transTime" :desc="form.transTime"></nut-cell>
    <nut-cell title="交易状态" v-if="form.statusDesc" :desc="form.statusDesc"></nut-cell>
    <nut-cell title="原交易单号" v-if="form.origSysSeqNum" :desc="form.origSysSeqNum"></nut-cell>
    <div class="skeleton" v-if="form.mchtName === ''" style="padding: 16px">
      <nut-skeleton :width="`${windowWidth - 32}px`" height="30px" animated row="6"></nut-skeleton>
    </div>
  </nut-cell-group>
</template>

<route lang="json">
  {
    "style": {
      "navigationBarTitleText": "订单详情",
      "backgroundColorContent": "#f1f1f1"
    }
  }
  </route>

  <style lang="sass" scoped>
  :deep(.nut-cell__value)
    word-break: break-all
  </style>